<template>
  <basetemplate  class="sdp-project"
    @baseMounted="baseMounted"
    :self="self">
  </basetemplate>
  <customtemplate
    @baseMounted="customMounted"
    :self="self">
  </customtemplate>
</template>

<script>
import { ref } from 'vue'
import basetemplate from '../index.vue'
import customtemplate from './custom_index.vue'
import { init } from '/src/utils/base'
import { init as initBase } from './base'
import { init as initCustom } from './custom'

export default {
    emits: ['baseMounted'],
    components:{
      basetemplate,
      customtemplate,
    },
    setup() {
        let self = {}

        initBase(self)
        initCustom(self)
        init(self)

        const baseMounted = (v) => {
          self.onMounted(v);
        }
        const customMounted = (v) => {
          if (self.custom.onMounted) {
            self.custom.onMounted(v)
          }
        }
        self.whiteSpace = ref(self.whiteSpace || 'pre-line')
        return {self:ref(self), baseMounted, customMounted, whiteSpace:self.whiteSpace};
    },
};
</script>
<style lang="scss">

// .sdp-project {
//   .el-tooltip__popper {
//     max-width: 300px;
//   }
//   .el-table .cell {
//     white-space: v-bind(whiteSpace) !important;
//   }
// }

</style>